<!doctype html>
<html class="no-js">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <script src="js/jquery-2.1.1.min.js"></script>
    <title>Amaze UI</title>


    <script type="text/javascript">
        $(function ($) {
            $('table tr').each(function(i,n){
                console.log(n);
                var $n=$(n);

                $n.on('click',function(){
                    console.log(this);
                })
            })
        });
    </script>
</head>
<body>
<style type="text/css">
    .table{
        border-collapse: collapse;
    }
    .td{
        border: 1px solid #cccccc;
        background-color: #ffffff;
    }
    .tr:hover{
        color: green;
    }
    .contener {
        width: 300px;
        margin: 10px auto;
    }

    .img {
        width: 100%;
    }
    .text_img {
        position: absolute;
        width: 100%;
        z-index: 2;
        bottom: 3px;
        background-color: rgba(189, 188, 188, 0.45);
    }
    .tr{
        cursor: pointer;
    }
</style>
<div class="contener">
    <table class="table">
        <tr class="tr">
           <td colspan="2" class="td">
               <h3>你好这是一个测试标题</h3>
               <p>8月15日</p>
               <img src="img/1366x768.jpg" alt="" width="100%"/>
               <div>
                        你好，这是描述的测试，这里是描述啊，哈哈哈哈，哈哈哈哈
               </div>
               <a href="#">查看全文</a>
           </td>
        </tr>
        <tr class="tr">
            <td colspan="2" class="td" style="position: relative">
                <img src="img/1366x768.jpg" alt="" class="img"/>

                <div class="text_img">
                    <div class="text_img_span">测试测试测试测试测试测试测试测试测试测试测试</div>
                </div>
            </td>
        </tr>
        <tr class="tr">
            <td class="td">测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试</td>
            <td><img src="img/1366x768.jpg" width="50px" height="50px"></td>
        </tr>
        <tr class="tr">
            <td class="td">测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试</td>
            <td class="td"><img src="img/1366x768.jpg" width="50px" height="50px"></td>
        </tr>
        <tr class="tr">
            <td class="td">测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试</td>
            <td class="td"><img src="img/1366x768.jpg" width="50px" height="50px"></td>
        </tr>
        <tr class="tr">
            <td class="td">测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试</td>
            <td class="td"><img src="img/1366x768.jpg" width="50px" height="50px"></td>
        </tr>
    </table>
</div>
</body>
</html>
